<!DOCTYPE html>
<style>
.border {
  border-left: solid 10px orange;
  border-right: solid 20px purple
}
.padding {
  padding-left: 10px;
  padding-right: 20px;
}
div {
  border: 5px solid blue;
}
.min {
  width: min-content;
}
.max {
  width: max-content;
}
</style>
<body>
  <div class="min">
    <span class="border">line1</span>
    <span class="border">line2</span>
    <span class="border">line3</span>
  </div>
  <div class="min">
    <span class="padding">line1</span>
    <span class="padding">line2</span>
    <span class="padding">line3</span>
  </div>
  <div class="max">
    <span class="border">
      line1 line2 line3
    </span>
  </div>
  <div class="max">
    <span class="border">line1 line2</span><br>
    <span class="border">line3</span>
  </div>
</body>
